<!--
 * Date：2017.05.14 星期日 下午
 * Function：注册页面
 * E-mail：woaitianwen@qq.com
 * Author：zhouyulong
 */
 -->

<%- include('header') -%>
<style>
.form_sign {
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
 }    
</style>
<div class="container">
  
<div class="form_sign">
<div class="panel panel-default">
    <div class="panel-heading">注册界面</div>
    <div class="panel-body">
            <form role="form" method="post">

                <div class="con"></div>
               
                <div class="form-group">
                    <label for="username">用户名:</label>
                    <input id="username" name="username" type="text" class="form-control" placeholder="请输入用户名">
                </div>
                <div class="form-group">
                    <label for="email">E-mail:</label>
                    <input id="email" name="email" type="email" class="form-control" placeholder="请输入电子邮箱">
                </div>
                <div class="form-group">
                    <label for="password">密码:</label>
                    <input id="password" name="password" type="password" class="form-control" placeholder="请输入密码">
                </div>
         
                <button id="signup" class="btn btn-block btn-primary">
                    注册
                </button>
                
            </form>
      </div>
   <div class="panel-footer"><a href="login">立即登录</a></div>
</div>

</div>
</div>
<script>

    //检查用户名是否存在
    function validation(data) {
    
    
        if (data.status == 1) {
            var con = '<div id="myAlert" class="alert alert-warning">'
                        +'<a href="#" class="close" data-dismiss="alert">&times;</a>用户名已经存在！'
                        +'</div>';
                        $('.con').append(con);
        } else if (data.status == 2) {      
            var con = '<div id="myAlert" class="alert alert-success">'
                        +'<a href="#" class="close" data-dismiss="alert">&times;</a>用户名或者密码错误！'
                        +'</div>';
                        $('.con').append(con);
                   
        } else if (data.status == 0) {      
            var con = '<div id="myAlert" class="alert alert-success">'
                        +'<a href="#" class="close" data-dismiss="alert">&times;</a>成功创建新用户！'
                        +'</div>';
                        $('.con').append(con);
                   
        } else if ($('#username').val() == '') {      
            var con = '<div id="myAlert" class="alert alert-success">'
                        +'<a href="#" class="close" data-dismiss="alert">&times;</a>用户名不能为空！'
                        +'</div>';
                        $('.con').append(con);
                   
        } else {
            var con = '<div id="myAlert" class="alert alert-warning">'
                        +'<a href="#" class="close" data-dismiss="alert">&times;</a>未知错误！'
                        +'</div>';
                        $('.con').append(con);
        }
    }

    function checkUser() {
            var username = $('#username').val();
            var email = $('#email').val();
            var password = $('#password').val();
            var data = { "username": username,"email": email,"password": password};
    
             $.ajax({
                //cache: false,
                url:'http://localhost:3000/api/user',
                type:'post',
                dataType: 'json',
                timeout: 3000,
                data: data,
                success: function(data) {

                    validation(data);

                }
            });
    }

    $(document).ready(function() {
        $("button#signup").click(function(e) {
            e.preventDefault();
            checkUser();
        });
    })


</script>
<%- include('footer') -%>